<template>
  <div class="iframe_container">
    <iframe
      :src="`https://m.ximalaya.com/${url}`"
      id="iframe"
      name="iframe"
      height="100%"
      width="375"
      class="iframe_item"
      style="width: 375px; height: 100%"
    ></iframe>
  </div>
</template>

<script lang="ts" setup>
import { useRoute } from "vue-router";
import { ref } from "vue";
const route = useRoute();
let url = ref(route.query.iframeUrl);
</script>

<style lang="less" scoped>
.iframe_container {
  width: 375px;
}

#root,
body,
html {
  width: 375px !important;
}
.iframe_container {
  width: 375px !important;
  height: 100vh;
  margin: 0px !important;
}

.page {
  width: 375px !important;
  min-width: 100px !important;
  overflow: hidden;
  height: 100vh;
  margin: 10px;
}

iframe {
  width: 375px !important;
  height: 100%;
}
</style>
